<template>
  <div class="px-[15px] grid grid-cols-2 gap-[15px] text-xs">
    <figure v-for="item in all" :key="item.id" class="rounded shadow bg-white">
      <img :src="item.cover" alt="" />
      <div class="px-[9px]">
        <h4 class="mt-[9px] text-gray-700">{{ item.name }}</h4>
        <p class="mt-[6px]">
          <span class="text-red-500">
            <i>￥</i>
            <strong class="text-sm font-semibold">
              {{ item.price }}
            </strong> </span
          ><span class="ml-2 text-gray-600 line-through">
            <i>￥</i>
            {{ item.origin_price }}</span
          >
        </p>

        <div class="mt-[4px] flex items-center justify-between">
          <div class="text-gray-500 text-sm">{{ item.sold }}已购</div>
          <wx-launch class="relative w-16 h-10 flex-shrink-0" :path="path">
            <button
              class="
                text-sm
                absolute
                top-2
                -right-1
                text-gray-400
                w-full
                text-right
              "
              :class="isWx ? 'pointer-events-none' : ''"
              @click="$openApp"
            >
              <van-icon name="like" />
              <span class="ml-1 text-gray-500">收藏</span>
            </button>
          </wx-launch>
        </div>
      </div>
    </figure>
  </div>
</template>

<script>
export default {
  props: ['all', 'path'],
}
</script>

<style>
</style>